<template>
  <view class="weidian" :data-theme="theme()" :class="theme() || ''">
    <view class="weidian_head">
      <view>
        <view class="weidian_head_body_bottom">
          <view class="weidian_head_body_bottom_item">
            <view>{{$t('my_live.total_income')}}({{$t('my_live.yuan')}})</view>
            <text>{{ data.totalPrice == null ? 0 : data.totalPrice }}</text>
          </view>
          <view class="weidian_head_body_bottom_item">
            <view>{{$t('my_live.total_orders')}}({{$t('my_live.transactions')}})</view>
            <text>{{ data.orderCount == null ? 0 : data.orderCount }}</text>
          </view>
          <view class="weidian_head_body_bottom_item">
            <view>{{$t('my_live.gift_income')}}</view>
            <text>{{ data.giftPrice }}</text>
          </view>
        </view>
      </view>
    </view>
    <view class="weidian_body">
      <view class="weidian_body_menu_list">
        <view
          class="weidian_body_menu_list_item"
          @click="gotoPage('/pagesLive/my_live/my-live/record')"
        >
          <view
            class="weidian_body_menu_list_left_icon icon iconfont icon-caidan"
          ></view>
          <view class="weidian_body_menu_list_title_left">{{$t('my_live.live_record')}}</view>
          <view
            class="weidian_body_menu_list_right_icon icon iconfont icon-jiantou"
          ></view>
        </view>
        <!--<view class="weidian_body_menu_list_item" @click="gosupPage('/pagesLive/my_live/my-live/my-live/edit')">
					<view class="weidian_body_menu_list_left_icon icon iconfont icon-gouwu"></view>
					<view class="weidian_body_menu_list_title_left">{{$t('my_live.product_management')}}</view>
					<view class="weidian_body_menu_list_right_icon icon iconfont icon-jiantou"></view>
				</view>-->
        <view
          class="weidian_body_menu_list_item"
          @click="gotoPage('/pagesLive/my_live/notice/notice')"
        >
          <view
            class="weidian_body_menu_list_left_icon icon iconfont icon-icon_xianshi-xian"
          ></view>
          <view class="weidian_body_menu_list_title_left">{{$t('my_live.live_preview')}}</view>
          <view
            class="weidian_body_menu_list_right_icon icon iconfont icon-jiantou"
          ></view>
        </view>
        <view
          class="weidian_body_menu_list_item"
          @click="gosupPage('/pagesLive/my_live/live-order/live-order')"
        >
          <view
            class="weidian_body_menu_list_left_icon icon iconfont icon-quanbudingdan"
          ></view>
          <view class="weidian_body_menu_list_title_left">{{$t('my_live.live_orders')}}</view>
          <view
            class="weidian_body_menu_list_right_icon icon iconfont icon-jiantou"
          ></view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      data: {
        giftPrice: 0,
        orderCount: 0,
        totalPrice: 0,
        shopSupplierId: "",
      },
    };
  },
  onLoad(e) {
    this.shopSupplierId = e.shopSupplierId;
  },
  onShow() {
    this.getData();
     uni.setNavigationBarTitle({
      title: this.$t('my_live.my_live')
    })
  },
  methods: {
    gosupPage(path) {
      this.gotoPage(path + "?shopSupplierId=" + this.shopSupplierId);
    },
    // 获取用户数据
    getData() {
      let self = this;
      self._get(
        "plus/live/room/livedata",
        {
          shopSupplierId: self.shopSupplierId,
        },
        function (res) {
          self.data = res.data;
        }
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.weidian {
}

.iconfont {
  font-size: 14px;
}

.weidian_head {
  width: 710rpx;
  border-radius: 20rpx;
  margin: 0 auto;
  margin-top: 20rpx;
  margin-bottom: 40rpx;
  background: linear-gradient(0deg, #fe632a 0%, #ff7a04 100%);
  @include background_linear(
    "background_color",
    "background_color",
    0deg,
    0,
    100%
  );
}

.weidian_body {
  background: #fff;
  width: 710rpx;
  margin: 0 auto;
  padding: 0 24rpx;
  border-radius: 25rpx;
  box-sizing: border-box;
}

.weidian_head_body_top {
  width: 100%;
  height: 200rpx;
  background-image: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.2),
    rgba(255, 255, 255, 0)
  );
}

.weidian_head_body_top_left {
  width: 50%;
  height: 200rpx;
  display: inline-block;
  font-size: 30rpx;
  color: white;
  padding-top: 40rpx;
  padding-left: 45rpx;
  box-sizing: border-box;
}

.weidian_head_body_top_left view {
  margin-top: 20rpx;
}

.weidian_head_body_top_left image {
  width: 36rpx;
  height: 36rpx;
  display: inline-block;
}

.weidian_head_body_top_right {
  width: 30%;
  display: inline-block;
  position: relative;
  top: -25rpx;
  left: 120rpx;
}

.weidian_head_body_top_right button {
  width: 82%;
  height: 60rpx;
  line-height: 60rpx;
  border-radius: 30rpx;
  color: #f36a23;
}

.weidian_head_body_bottom {
  width: 100%;
  height: 160rpx;
  padding-top: 30rpx;
  box-sizing: border-box;
  font-size: 26rpx;
}

.weidian_head_body_bottom_item {
  width: 33%;
  display: inline-block;
  float: left;
  /* margin: 0 41rpx; */
  color: white;
  text-align: center;
}

.weidian_head_body_bottom_item view {
  margin-bottom: 20rpx;
}

.weidian_head_body_bottom_item text {
  font-size: 30rpx;
}

/* 我的订单css */
.seller_center_body_order {
  width: 90%;
  background-color: white;
  margin: 0 auto;
  border-radius: 20rpx;
  padding: 20rpx;
  box-sizing: border-box;
}

.seller_center_body_order_head {
  font-size: 30rpx;
  margin-bottom: 50rpx;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.seller_center_body_order_head_more {
  font-size: 24rpx;
  color: #7f7f7f;
  display: flex;
  align-items: center;
}

.seller_center_body_order_body {
  width: 100%;
}

.seller_center_body_order_body_item {
  display: inline-block;
  width: 25%;
  text-align: center;
}

.seller_center_body_order_body image {
  width: 48rpx;
  height: 48rpx;
  margin: 0 auto;
  margin-bottom: 20rpx;
}

/* 订单css  END */
.weidian_body_menu_list {
  font-size: 30rpx;
  color: #484848;
}

.weidian_body_menu_list_item {
  height: 102rpx;
  line-height: 102rpx;
  border-bottom: 1rpx #eee solid;
  box-sizing: border-box;
}

.weidian_body_menu_list_item:last-child {
  border: none;
}

.weidian_body_menu_list_title_left {
  display: inline-block;
  float: left;
}

.weidian_body_menu_list_right_icon {
  display: inline-block;
  float: right;
  font-size: 28rpx;
  color: #333;
}

.weidian_body_menu_list_left_icon {
  display: inline-block;
  float: left;
  font-size: 36rpx;
  margin-right: 18rpx;
  color: #333;
}
</style>
